
import './Ceecs.css';
import 'react-bootstrap-typeahead/css/Typeahead.css';
import { Header } from './components/Header';
import { Footer } from './components/Footer';
import { Qs } from './sections/Qs';
import { QAs } from './sections/QAs';
import { A } from './sections/A';
import { useEffect } from 'react';
import { useDispatch } from 'react-redux';
import { ActionCreators } from 'redux-undo';
import 'intro.js/introjs.css';

function Ceecs() {
  document.title = "品智AI选课助手";
  const dispatch = useDispatch();
  useEffect(() => {
    let lastTimestamp = undefined;
    const handlePopState = (event) => {
      const currentTimestamp = event.state ? event.state.timestamp : null;
      if (currentTimestamp > lastTimestamp) {
        dispatch(ActionCreators.redo());
      } else if (!lastTimestamp || currentTimestamp < lastTimestamp) {
        dispatch(ActionCreators.undo());
      }
      lastTimestamp = currentTimestamp;
    };
    window.addEventListener('popstate', handlePopState);
    return () => window.removeEventListener('popstate', handlePopState);
  }, [dispatch]);
  return (
    <div className="Ceecs">
      <Header></Header>
      <Qs></Qs>
      <QAs></QAs>
      <A></A>
      <Footer></Footer>
    </div>
  );
}

export default Ceecs;
